<template>
    <div class="link">
        <!--S显示Value-->
        <cube-input
                :value="link_name"
                placeholder="设置推广链接">
        </cube-input>
        <!--E显示Value-->

        <!--S遮挡input-->
        <div id="keep-out"
             @click="$emit('showLink')">
            <i v-show="link_name !== ''" class="cubeic-close" @click.stop="$emit('cancel')"></i>
        </div>
        <!--E遮挡input-->

    </div>
</template>

<script>
    import {mapState} from "vuex";
    export default {
        name: "Link",
        data(){
            return {
                show_link:false, //显示推广链接管理
            }
        },
        model:{
            prop:'data',
            event:"change"
        },
        props:{
          //value值
          value:{
              type:String
          }
        },
        computed:{
            ...mapState({
                link_name:"link_name"
            })
        }
    }
</script>

<style scoped lang="less">
    #keep-out{
        position: absolute;
        top:0;
        width: 100%;
        height: 45px;
        background: rgba(0,0,0,0);
        i{
            position: absolute;
            top:9px;
            left: 190px;
            display: block;
            width: 25px;
            height: 25px;
            line-height: 25px;
            text-align: center;
            border-radius: 15px;
            font-size: 20px;
            color: #fff;
            background: rgba(0,0,0,.5);
        }
    }
</style>
